<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>检查结果管理页</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport"
    content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="../../layuiadmin/style/admin.css" media="all">
  <style>

  </style>
</head>

<body>
  <div class="layui-fluid" id="LAY-component-grid-list">
    <div class="layui-row layui-col-space10 demo-list">
      <div class="layui-col-sm12 layui-col-md12 layui-col-lg12">
        <!-- 查询检查条目 -->
        <div class="layui-card">
          <div class="layui-card-header">查询</div>
          <div class="layui-card-body" id="search-view">
            <form class="layui-form" action="" id="searchForm">
              <div class="layui-form-item">
                <div class="layui-inline">
                  <label class="layui-form-label">患者Id</label>
                  <div class="layui-input-inline">
                    <input type="text" name="inpatientId" autocomplete="off" class="layui-input">
                  </div>
                </div>
                <div class="layui-inline">
                  <label class="layui-form-label">检查医生Id</label>
                  <div class="layui-input-block">
                    <input type="text" name="empId" autocomplete="off" class="layui-input">
                  </div>
                </div>
              </div>
              <div class="layui-form-item">
                <div class="layui-inline">
                  <label class="layui-form-label">检查结果Id</label>
                  <div class="layui-input-block">
                    <input type="text" name="examItemId" autocomplete="off" class="layui-input">
                  </div>
                </div>
                <div class="layui-inline">
                  <label class="layui-form-label">检查条目Id</label>
                  <div class="layui-input-block">
                    <input type="text" name="examItemId" autocomplete="off" class="layui-input">
                  </div>
                </div>
                <div class="layui-inline">
                  <label class="layui-form-label">检查单id</label>
                  <div class="layui-input-inline">
                    <input type="text" name="examinationId" autocomplete="off" class="layui-input">
                  </div>
                </div>
              </div>
              <div class="layui-form-item">
                <div class="layui-inline">
                  <label class="layui-form-label">检查项目</label>
                  <div class="layui-input-block">
                    <input type="text" name="examNameContent" autocomplete="off" class="layui-input">
                  </div>
                </div>
                <div class="layui-inline">
                  <label class="layui-form-label"></label>
                  <div class="layui-input-inline">
                    <button type="submit" class="layui-btn layui-icon layui-icon-search" lay-submit="" lay-filter="search">查询</button>
                    <button type="reset" class="layui-btn layui-btn-warm layui-icon layui-icon-refresh">重置</button>
                  </div>
                </div>
              </div>
            </form>
          </div>
        </div>
        <div class="layui-card">
          <div class="layui-card-header">检查结果</div>
          <div class="layui-card-body">
            <!-- 检查条目的表格 -->
            <table id="examinationItem-table" lay-filter="examinationItemTable">
            </table>
          </div>
        </div>
      </div>

    </div>
  </div>

  <script src="../../layuiadmin/layui/layui.js" charset="utf-8"></script>

  <!-- 表格工具条开始 -->
  <div id="table-toolbar" style="display: none" lay-filter="tableToolbar">
    <!-- <button type="submit" class="layui-btn" lay-event="addBooking">添加</button> -->
    <!-- <button type="reset" class="layui-btn layui-btn-primary" lay-event="batchDelete">批量删除</button> -->
  </div>
  <!-- 表格工具条结束 -->
  <!-- 行工具开始 -->
  <!-- <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a> -->
  <!-- <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="addResult">添加检查结果</a> -->
  <!-- <button type="button" class="layui-btn layui-btn-xs" lay-event="upload" id="uploadExamResult">
      <i class="layui-icon">&#xe67c;</i>上传检查结果
    </button> -->
  <script type="text/html" id="row-bar">
    <a class="layui-btn layui-btn-xs layui-icon layui-icon-edit" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs layui-icon layui-icon-delete" lay-event="del">删除</a>
    
  </script>
  <!-- 行工具结束 -->

  <!-- 检查结果修改，弹出层开始 -->
  <div style="display: none;" id="addOrEditDiv">
    <form id="dataForm" lay-filter="dataForm" class="layui-form" style="padding: 20px" action="">
      <!-- 隐藏检擦条目的id -->
      <input type="hidden" name="examItemId">
      <div class="layui-form-item">
        <!-- <div class="layui-inline">
          <label class="layui-form-label">患者Id</label>
          <div class="layui-input-inline">
            <input type="text" name="inpatientId" autocomplete="off" class="layui-input" lay-verify="required">
          </div>
        </div>
        <div class="layui-inline">
          <label class="layui-form-label">患者姓名</label>
          <div class="layui-input-inline">
            <input type="text" name="inpatientName" autocomplete="off" class="layui-input" lay-verify="required">
          </div>
        </div> -->
      </div>
      <div class="layui-form-item">
        <div class="layui-block">
          <label class="layui-form-label">检查结果id</label>
          <div class="layui-input-block">
            <input type="text" name="examResultId" autocomplete="off" class="layui-input" lay-verify="required" readonly>
          </div>
        </div>
      </div>
      <div class="layui-form-item">
        <div class="layui-block">
          <label class="layui-form-label">检查条目id</label>
          <div class="layui-input-block">
            <input type="text" name="examItemId" autocomplete="off" class="layui-input" lay-verify="required" readonly>
          </div>
        </div>
      </div>
      <div class="layui-form-item">
        <div class="layui-block">
          <label class="layui-form-label">检查医生</label>
          <div class="layui-input-block">
            <input type="text" name="empId" autocomplete="off" class="layui-input" lay-verify="required">
          </div>
        </div>
      </div>
      <div class="layui-form-item">
        <div class="layui-block">
          <label class="layui-form-label">检查时间</label>
          <div class="layui-input-block">
            <input type="text" name="examResultTime" autocomplete="off" class="layui-input" id="examRsult-Time" lay-verify="required">
          </div>
        </div>
      </div>
      <div class="layui-form-item">
        <div class="layui-block">
          <label class="layui-form-label">检查结果</label>
          <div class="layui-input-block">
            <textarea name="result" placeholder="请输入内容" class="layui-textarea" lay-verify="required"></textarea>
          </div>
        </div>
      </div>
      <div class="layui-form-item">
        <div class="layui-block">
          <label class="layui-form-label">检查意见</label>
          <div class="layui-input-block">
            <textarea name="examResultOpinion" placeholder="请输入内容" class="layui-textarea"
              lay-verify="required"></textarea>
          </div>
        </div>
      </div>
      <div class="layui-form-item">
        <div class="layui-block">
          <label class="layui-form-label">备注</label>
          <div class="layui-input-block">
            <textarea name="note" placeholder="请输入内容" class="layui-textarea"></textarea>
          </div>
        </div>
      </div>
      <div class="layui-form-item" align="center">
        <div class="layui-input-block">
          <button class="layui-btn layui-btn-sm layui-icon layui-icon-release" type="submit" lay-filter="editResultBtn"
            lay-submit="">保存</button>
          <button class="layui-btn layui-btn-warm layui-btn-sm layui-icon layui-icon-refresh " type="reset">重置</button>
        </div>
      </div>
    </form>
  </div>
  <!-- 检查结果添加，弹出层结束 -->


  <script>
    layui.config({
      base: '../../layuiadmin/' //静态资源所在路径
    }).extend({
      index: 'lib/index' //主入口模块
    }).use(['laytpl', 'jquery', 'form', 'element', 'laypage', 'table', 'layer', 'laydate','upload'], function () {
      var laytpl = layui.laytpl;
      var $ = layui.$;
      var form = layui.form;
      var element = layui.element;
      var laypage = layui.laypage;
      var table = layui.table;
      var layer = layui.layer;
      var laydate = layui.laydate;
      var upload = layui.upload;
      var data;

      // 表格渲染
      var tableIns = table.render({
        elem: "#examinationItem-table",
        url: "/examinationresult/all",
        method: "post",
        contentType: 'application/json',
        defaultToolbar: [],
        toolbar: "#table-toolbar",
        area: '800px',
        page: true,
        even: true,
        cols: [
          [ // 表头
            {
              type: 'checkbox',
              fixed: 'left'
            }, {
              field: 'examResultId',
              title: 'ID',
              width: 260,
              sort: true,
            }, {
              field: 'examItemId',
              title: '检查条目Id',
              width: 260
            }, {
              field: 'examResultTime',
              title: '检查时间',
              width: 100,
              sort: true
            }, {
              field: 'empId',
              title: '检查医生',
              width: 100
            }, {
              field: 'result',
              title: '检查结果',
              width: 100,
              sort: true
            }, {
              field: 'examResultOpinion',
              title: '检查意见',
              width: 260,
              sort: true
            },{
              field: 'note',
              title: '备注',
              width: 260,
              sort: true
            }, {
              toolbar: "#row-bar",
              title: '操作',
              width: 260
            }
          ]
        ]
      })
      /* 监听头部工具栏时间 */
      table.on("toolbar(examinationItemTable)", function (obj) {
        switch (obj.event) {
          case "addBooking":
            layer.msg("添加")
            openAdd()
            break;
          case "batchDelete":
            layer.msg("批量删除")
            batchDelete()
            break;
        }
      })
      // 渲染时间选择器
      laydate.render({
        	elem:"#examRsult-Time",
        	type:"datetime"
        })
      // 添加或者修改的url
      var addOrEditUrl;
      // 弹出层的索引
      var mainIndex;
      /* 打开添加页面 */
      function openAdd() {
        mainIndex = layer.open({
          type: 1,
          title: '添加检查条目信息',
          content: $("#addOrEditDiv"),
          area: ['800px'],
          success: function (index) {
            $("#dataForm")[0].reset();
            addOrEditUrl = "/surgeryBooking/add";
          }
        });
      }
      /* 批量删除 */
      function batchDelete() {

      }
      // 行中工具条事件
      table.on('tool(examinationItemTable)', function (
      obj) { //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
        var data = obj.data; //获得当前行数据
        var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）

        if (layEvent === 'del') { //删除
          layer.confirm('真的删除行么', function (index) {
            obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
            layer.close(index);
            //向服务端发送删除指令
            openDelete(data)
          });
        } else if (layEvent === 'edit') { //编辑
          openEdit(data);
        } else if (layEvent === 'addResult') {
          // 添加检查结果
          addResult(data);
        } else if(layEvent === 'upload'){
          uploadExamResultFile(data);
        }
      });
      /* 删除，更改为过期的信息  */
      function openDelete(data) {
        $.ajax({
          url: addOrEditUrl,
          contentType: 'application/json;charset=utf-8',
          type: "post",
          data: JSON.stringify(data.field),
          success: function (res) {
            layer.msg("success")
          }
        });
      }
      /* 打开修改页面 */
      function openEdit(data) {
        console.log(data)
        mainIndex = layer.open({
          type: 1,
          title: '修改检查结果信息',
          content: $("#addOrEditDiv"),
          area: ['800px'],
          success: function (index) {
            form.val("dataForm", data);
            addOrEditUrl = "/examinationresult/update";
          }
        });
      }
      // 上传检查结果的文件，带完成
      function uploadExamResultFile(da){
        var uploadExamResultFileRender = upload.render({
        elem: "#uploadExamResult", // 绑定元素
        url: "", //绑定接口
        data:function(){
        },
        done:function(data){

        },
        error:function(error){
          alert(error)
        }
      });
      }
      //触发弹出层的更新或者添加按钮
      form.on("submit(editResultBtn)", function (data) {

        var params = $("#addOrEditDiv form").serialize()
        console.log(data)
        $.ajax({
          url: addOrEditUrl,
          contentType: 'application/json;charset=utf-8',
          type: "post",
          data: JSON.stringify(data.field),
          success: function (res) {
            layer.msg("success")
            console.log(data)
            //关闭弹出层
            layer.close(mainIndex);
            tableIns.reload()
          }
        });
        return false;
      });
      // 条件查询
      form.on('submit(search)', function (data) {
        //alert(data.data)
        console.log(data.field)
        // 表格数据重载
        tableIns.reload({
          where: data.field
        })
        return false;
      })

    })
  </script>
</body>

</html>